<template>
	<view class="gjl-view">
		<!-- <u-navbar back-text="我的地址" :back-text-style="{fontSize: '32rpx',color: '#fff',fontWeight:'bold'}"
			:background="{background: 'linear-gradient(90deg, #FF9B4E 0%, #FF7440 100%)'}" back-icon-color="#fff"
			back-icon-size="28" title=" ">
		</u-navbar> -->
		<view class="content">
			<view class="address-list">
				<view class="address-item">
					<addressItem @btnClick="btnClick" :icon="showChange?'clear':'edit'"></addressItem>
				</view>
			</view>
		</view>
		<addressFooter @btnClick="footerClick" :status="showChange"></addressFooter>
	</view>
</template>

<script>
	import addressItem from '../components/delivery_address/address-item.vue';
	import addressFooter from '../components/delivery_address/address-footer.vue';
	export default {
		components:{
			addressItem,
			addressFooter
		},
		data(){
			return {
				showChange: false
			}
		},
		methods: {
			btnClick(item,index){
				if(this.showChange){
					uni.showModal({
						title: '提示',
						content: '确认删除当前地址?',
						success: function(res) {
							if (res.confirm) {
								console.log('用户点击确定');
								uni.navigateBack({
									delta: 1
								});
							} else if (res.cancel) {
								
							}
						}
					})
					return
				}
				this.jRouter({path: 'deliveryAddressAdd',query: {edit: 1}})
			},
			footerClick(index){
				if(index == 1){
					this.showChange = !this.showChange;
					return
				}
				if(index == 2){
					this.jRouter({path: 'deliveryAddressAdd'})
				}
			}
		}
	}
</script>
<style>
	page{
		height: 100%;
		background-color: #F5F5F5;
	}
</style>
<style scoped lang="scss">
	.gjl-view {
		.content{
			padding: 0 30rpx;
			.address-list{
				overflow: hidden;
				.address-item{
					margin-top: 20rpx;
					padding: 30rpx;
					background: #FFFFFF;
					border-radius: 20rpx;
				}
			}
		}
	}
</style>
